<template>
  <el-select v-model="valueId" :placeholder="placeholder" clearable>
    <el-option v-for="item in options" :key="item.value" :label="item.label" :value="item.value" />
  </el-select>
</template>
<script setup lang="ts">
const props = defineProps({
  /**当前双向数据绑定的值 */
  value: {
    type: [String, Number],
    default: ''
  },
  dict: {
    type: String,
    default: ''
  },
  /**输入框内部的文字 */
  placeholder: {
    type: String,
    default: '请选择'
  }
})

const emit = defineEmits(['update:value']);

const { proxy } = getCurrentInstance() as ComponentInternalInstance;
const options = toRef<Array<DictDataOption>>(proxy?.useDict(props.dict), props.dict);

const valueId = computed({
  get: () => props.value,
  set: (val) => {
    emit('update:value', val)
  }
});
</script>